<template>
	<view class="page">
		<navHead :datas="headData"></navHead>
		<view class=" pd-30">
			<view class="card pd-20">
				<view class="ft1">{{ '输入转账流水号' }}</view>
				<view class="input mt-20 pd-10">
					<up-input v-model="trade_no" placeholder="请输入" placeholderStyle="font-size: 24rpx;color: #999999;"
						border="none"></up-input>
				</view>
			</view>
		</view>
	</view>
	<view class="bottom ">
		<view class="btn auto flex-center ft c-dbf  mt-20" @click="submit"> 提交</view>
	</view>
</template>
<script setup lang="js">
import {
	onLoad
} from '@dcloudio/uni-app'
import {
	ref,
	reactive,
	onMounted,
	getCurrentInstance
} from "vue";

import navHead from '@/components/navHead.vue';
const headData = reactive({
	color: '#fff',
	title: '转账信息'
})

const {
	proxy
} = getCurrentInstance();

const trade_no = ref('')
onLoad((options) => {
	const eventChannel = proxy.getOpenerEventChannel();
	// 接收数据
	eventChannel.on('toDetail', (data) => {
		trade_no.value = data.trade_no
	});
})

const submit = () => {
	const eventChannel = proxy.getOpenerEventChannel();
	eventChannel.emit('fromDetail', {
		trade_no: trade_no.value
	});
	uni.navigateBack(-1)
}
</script>

<style lang="scss" scoped>
.card {
	width: 690rpx;
	height: 216rpx;
	background: #F8F8F8;
	border-radius: 40rpx 40rpx 40rpx 40rpx;

	.input {
		width: 650rpx;
		height: 74rpx;
		background: #FFFFFF;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		display: flex;
		align-items: center;
	}
}

.bottom {
	position: fixed;
	bottom: 0;
	width: 750rpx;
	height: 208rpx;
	background: #F8F8F8;
	border-radius: 0rpx 0rpx 0rpx 0rpx;

	.btn {
		width: 690rpx;
		height: 78rpx;
		background: #333333;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
	}
}
</style>